<template>
<div>
  <!-- elementUi -->
    <el-carousel :interval="3000" arrow="always" height="800px"  >
    <el-carousel-item v-for="(img,index) in img" :key="index">
        <img :src="img.url" height="100%">
    </el-carousel-item>
  </el-carousel>
  <div class="wel-list3">
  <div class="wel3-all">
    <a href="https://www.sddc.cn/layout.html"><img src="https://www.sddc.cn/upload/2019/12/06/15756199976744i5fxp.jpg" alt="时代地产"></a>
    <a href="https://www.sddc.cn/strategy.html"><img src="https://www.sddc.cn/upload/2019/12/06/157562000621647dtto.jpg" alt="战略发展"></a>
    <a href="https://www.sddc.cn/welfare/value.html"><img src="https://www.sddc.cn/upload/2019/12/06/1575620013236740jv8.jpg" alt="时代公益"></a>
    <a href="https://www.sddc.cn/join/talent.html"><img src="https://www.sddc.cn/upload/2019/12/06/15756200220694tqfr7.jpg" alt="加入时代"></a>
  </div>
 </div>
</div>

</template>

<script>
export default {
  data() {
    return {
      img: [
        { 
            url: require("@/assets/01.jpg") 
        },
        { 
            url: require("@/assets/02.png") 
        },
        { 
            url: require("@/assets/03.jpg") 
        },
      ],
    };
  },
};
</script>

<style lang="scss" scoped>
li{
  list-style:none;
}
.wel-list3{
  margin-top: 20px;
  margin-bottom: 20px;
}
.wel3-all{
  margin:0 auto;
  display: flex;
  flex: 1;
  overflow: hidden;
  margin-right:-20px
}
.wel3-all a img{
  width:100%;
  background-size: contain;
  overflow: hidden;
  margin-top: 20px;
}
.wel3-all a img:hover{
  transition: 1.5s;
  transform: scale(1.1);
}
.el-carousel{
  width:99vw
}
</style>